<template>
	<view class="content fz12">
		<view class="title fw">订单编号：{{orderId}}</view>
		<view class="messageBar" v-for="item in product" :key="item.id">
			<view class="top disb aic">
				<view class="left disp aic">
					<view class="box"></view>
					<view class="fw fz14">产品信息</view>
				</view>
				<view class="color9" @click="show=!show">{{show?'收起':'展开'}}</view>
			</view>
			<view :class="show?'detail':'detail none'">
				<view class="bar disb aic" @click="goDetail(item.id)">
					<view class="disp aic">
						<view class="">申请产品：</view>
						<view class="disp aic">
							<image class="pic" :src="item.productImg" mode=""></image>
							<view class="">{{item.productName}}</view>
						</view>
					</view>
					<image class="right" src="../../static/images/preat/right.png" mode=""></image>
				</view>
				<view class="bar disp">
					<view class="">预估额度：</view>
					<view class="color fw">
            <text>
              ￥{{item.ygAmount}}
            </text>
          </view>
				</view>
				<view class="bar disp">
					<view class="">产品属性：</view>
					<view class="">{{item.productLable}}</view>
				</view>
			</view>
		</view>


    <view class="messageBar" v-for="item in poList" :key="item.id">
      <view class="top disb aic">
        <view class="left disp aic">
          <view class="box"></view>
          <view class="fw fz14">产品准入-产品信息</view>
        </view>
        <view class="color9" @click="show=!show">{{show?'收起':'展开'}}</view>
      </view>
      <view :class="show?'detail':'detail none'">
        <view class="bar disb aic">
          <view class="disp aic">
            <view class="">名称：</view>
            <view class="disp aic">
              <image class="pic" :src="item.productImg" mode=""></image>
              <view class="">{{item.productName}}</view>
            </view>
          </view>
        </view>
        <view class="bar disp">
          <view class="">还款方式：</view>
          <view class="color fw">
            <text>
              {{item.modeOfRepayment}}
            </text>
          </view>
        </view>
        <view class="bar disp">
          <view class="">申请流程：</view>
          <view class="color fw">
            <text>
              {{item.procedures}}
            </text>
          </view>
        </view>
        <view class="bar disp">
          <view class="">{{annualInterestLabel}}：</view>
          <view class="color fw">
            <text>
              {{item.timeRate}}
            </text>
          </view>
        </view>

        <view class="bar disp">
          <view class="">还款期限：</view>
          <view class="">{{item.deadline}}</view>
        </view>

        <view class="bar disp">
          <view class="">{{maxAmountLabel}}：</view>
          <view class="color fw">
              <u--text mode="price" :text="item.quotaFormula"  size="17" color="#D34200" bold="true"></u--text>
          </view>
        </view>

        <view class="bar disp">
          <view class="">月供信息：</view>
          <view class="color fw">
              <u--text mode="price" :text="item.monthlyInfo"  size="17" color="#D34200" bold="true"></u--text>
          </view>
        </view>

        <view class="bar disp">
          <view class="">业务员提成：</view>
          <view class="color fw" v-if="applyState==3">
             <span style="float: right;position: absolute;">
               <u--text mode="price" :text="item.salesmanDeduct" size="16" color="#D34200" bold="true"></u--text>
            </span>
          </view>
          <view class="color fw" v-if="applyState<3">
             <span style="float: right;position: absolute;" v-if="item.units=='元'">
               <u--text mode="price" :text="item.salesmanDeduct" size="16" color="#D34200" bold="true"></u--text>
            </span>
            <span  v-if="item.units!='元'">
              {{item.salesmanDeduct}}  {{item.units}}
            </span>
          </view>
        </view>

        <view class="bar disp">
          <view class="">收费标准：</view>
          <view class="color fw" v-if="applyState==3">
             <span style="float: right;position: absolute;">
               <u--text mode="price" :text="item.directProfit" size="16" color="#D34200" bold="true"></u--text>
            </span>
          </view>
          <view class="color fw" v-if="applyState<3">
             <span style="float: right;position: absolute;" v-if="item.units=='元'">
               <u--text mode="price" :text="item.directProfit" size="16" color="#D34200" bold="true"></u--text>
            </span>
            <span  v-if="item.units!='元'">
              {{item.directProfit}}  {{item.units}}
            </span>
          </view>
        </view>

      </view>
    </view>

		<view class="messageBar">
			<view class="top disb aic">
				<view class="left disp aic">
					<view class="box"></view>
					<view class="fw fz14">用户基本信息</view>
				</view>
				<view class="color9" @click="messShow=!messShow">{{messShow?'收起':'展开'}}</view>
			</view>
			<view :class="messShow?'detail':'detail none'">
				<view class="bar disp">
					<view class="color9 fl1">姓名：</view>
					<view class="fl1">{{user.name}}</view>
				</view>
				<view class="bar disp">
					<view class="color9 fl1">性别：</view>
					<view class="fl1">{{getSex(user.sex)}}</view>
				</view>
				<view class="bar disp">
					<view class="color9 fl1">年龄：</view>
					<view class="fl1">{{user.age}}</view>
				</view>
				<view class="bar disp">
					<view class="color9 fl1">户籍：</view>
					<view class="fl1">{{user.censusRegister}}</view>
				</view>
				<view class="bar disp">
					<view class="color9 fl1">户口：</view>
					<view class="fl1">{{user.registeredHk}}</view>
				</view>
			</view>
		</view>
		<view class="messageBar">
			<view class="top disb aic">
				<view class="left disp aic">
					<view class="box"></view>
					<view class="fw fz14">用户资产信息</view>
				</view>
				<view class="color9" @click="propertyShow=!propertyShow">{{propertyShow?'收起':'展开'}}</view>
			</view>
			<view :class="propertyShow?'type tac colorf':'type tac colorf none'">{{"车辆信息"}}</view>
			<view :class="propertyShow?'detail':'detail none'" v-for="item,index in carList" :key="index">
				<view class="bar disp">
					<view class="color9 fl1">行业：</view>
					<view class="fl1">{{item.industry}}</view>
				</view>
				<view class="bar disp">
					<view class="color9 fl1">车辆状态：</view>
					<view class="fl1">{{item.carState?'正常':'不正常'}}</view>
				</view>
				<view class="bar disp">
					<view class="color9 fl1">车辆座位：</view>
					<view class="fl1">{{item.carNumber}}座</view>
				</view>
				<view class="bar disp">
					<view class="color9 fl1">车辆动力：</view>
					<view class="fl1">{{item.carPower}}</view>
				</view>
				<view class="bar disp">
					<view class="color9 fl1">是否个人名下非营运：</view>
					<view class="fl1">{{item.isOperation==1?'是':'否'}}</view>
				</view>
				<view class="bar disp">
					<view class="color9 fl1">职务：</view>
					<view class="fl1">{{item.job}}</view>
				</view>
				<view class="bar disp">
					<view class="color9 fl1">全款车目前市场价：</view>
					<view class="fl1">{{item.totalPayment}}</view>
				</view>
				<view class="bar disp">
					<view class="color9 fl1">按揭车剩余本金：</view>
					<view class="fl1">{{item.oddCorpus}}</view>
				</view>
			</view>
		</view>

    <view class="messageBar" v-if="userType==2">
      <view class="top disb aic">
        <view class="left disp aic">
          <view class="box"></view>
          <view class="fw fz14">完善身份证号</view>
        </view>
        <view class="color9" @click="idCardShow=!idCardShow">{{idCardShow?'收起':'展开'}}</view>
      </view>
      <view :class="idCardShow?'detail-card':'detail none'">
        <view class="bar disp">
          <view class="color9 fl1">身份证号：</view>
          <view class="fl1">
            <u--input
                type="idcard"
                v-model="user.identityCard"
                maxlength = "18"
                placeholder="请输入身份证号"
                border="surround"
                customStyle="customStyle"
            ></u--input>
          </view>

        </view>
        <view class="bar disp" style="margin-top: 3%;" v-if="applyState!=3">
<!--          <view class="btn btn-bg1 colorf tac" style="width: 100%"  v-if="applyState!=0" @click="updateIdCards">-->
<!--            保存-->
<!--          </view>-->
          <view class="tac reSets colorf fz12" @click="updateIdCards">
            保存/更新
          </view>
        </view>

      </view>
    </view>

    <view class="messageBar" v-if="userType==2">
      <view class="top disb aic">
        <view class="left disp aic">
          <view class="box"></view>
          <view class="fw fz14">用户公式表资料</view>
        </view>
        <view class="color9" @click="userZl=!userZl">{{userZl?'收起':'展开'}}</view>
      </view>
      <view :class="userZl?'detail-user-zl':'detail none'">
        <view class="bar disp" v-for="item in product" :key="item.id">
          <view class="color9 fl1">{{item.productTypeName}}</view>
<!--          <view class="tac reSet colorf fz12" v-if="applyState!=3"  @click="goUserZl(item.productType,user.id)">-->
          <view class="tac reSet colorf fz12" v-if="applyState!=3"  @click="goUserZl(item.productType)">
            修改资料
          </view>
        </view>

      </view>
    </view>


		<view class="messageBar" v-if="recordRespVO.causeOfFailure">
			<view class="top disb aic">
				<view class="left disp aic">
					<view class="box"></view>
					<view class="fw fz14">资料审核结果</view>
				</view>
				<view class="color9" @click="nopass=!nopass">{{nopass?'收起':'展开'}}</view>
			</view>
			<view :class="nopass?'detail':'detail none'">
				<view class="disb aic">
					<view class="fl1">
						<view class="bar disp">
							<view class="color9 fl1">资料审核结果：</view>
							<view class="fl1">{{recordRespVO.causeOfFailure}}</view>
						</view>
						<view class="bar disp">
							<view class="color9 fl1">驳回时间：</view>
							<view class="fl1">{{getTime(recordRespVO.createTime)}}</view>
						</view>
					</view>
					<view class="tac reSet colorf fz12" v-if="flowN<=6 && userType==2 && applyState!=0 && applyState!=3" @click="changeInform">修改资料</view>
				</view>
			</view>
		</view>

    <view class="v-div">
      <view class="btn btn-bg1 colorf tac v-width" @click="goNext(1)" v-if="userType==2 && recordRespVO.isFail!=3 && applyState!=0 && applyState!=3">
        <image :src="imguser+'/minis/order/wszl.png'" mode=""></image>
        完善资料
      </view>
      <view class="btn btn-bg2 colorf tac v-width" @click="goNext(3)" v-if="userType==2 && recordRespVO.isFail!=3 && applyState!=0 && applyState!=3">
        <image :src="imguser+'/minis/order/error.png'" mode=""></image>
        单子驳回
      </view>
    </view>

    <view class="blueBtn colorf tac" @click="goNext(1)" v-if="flowN<=6 && userType==3 && applyState!=3">
      <image :src="imguser+'/minis/order/wszl.png'" mode=""></image>
      审核资料
    </view>
    <view class="greenBtn disc jsa aic" @click="goNext(2)" v-if="userType==3">
		<view class="disp aic colorf">
      <image :src="imguser+'/minis/order/audit.png'" mode=""></image>
      <text>审核进度</text>
    </view>
    </view>
		<view class="contactBtn disc jsa aic" @click="callPhone">
			<view class="disp aic colorf">
				<image :src="imguser+'/minis/home/phone.png'" mode=""></image>
        <text>
          联系客户
        </text>
			</view>
		</view>
	</view>
</template>

<script>
	import {getCustomerDetail,updateIdCard} from "../../api/search.js"
  import UButton from "../../uni_modules/uview-ui/components/u-button/u-button.vue";
  import UText from "../../uni_modules/uview-ui/components/u-text/u-text.vue";
  import config from '@/common/config'
	export default {
    components: {UText, UButton},
		data() {

			return {
				userType:uni.getStorageSync('userInfo').userType,
        flowN:null,
				show:true,
				messShow:true,
				nopass:true,
				id:null,
        applyState:'',
				propertyShow:true,
        idCardShow:true,
        userZl:true,
				orderId:null,
        mobile:null,
				product:[],
        poList:[],
				user:[],
        tableId:null,
				carList:[],
				recordRespVO:[],
				orderProcessRecord:null,
        imguser:config.baseImgUrl,
        annualInterestLabel: '年化利率',
        maxAmountLabel: '预估额度'
			};
		},
		onLoad(option) {
			this.id = option.id
			this.getDetail(option.id)
			this.getWordings()
		},
    onShow(){
      this.getDetail(this.id)
    },
    callPhone() {
      wx.makePhoneCall({
        phoneNumber: this.mobile, // 需要用户手动点击拨号
      });
    },
		methods:{
			//性别
			getSex(i){
				if(i==1){
					return '男'
				}
				if(i==2){
					return '女'
				}
				if(i==3||!i){
					return '未知'
				}
			},
			getDetail(id){
				getCustomerDetail({orderId:id}).then(res => {
					this.orderId = res.data.orderId
          this.applyState = res.data.applyState
          this.poList = res.data.poList
          this.tableId = res.data.tableId
					this.product = res.data.product
					this.user = res.data.user
          this.mobile = res.data.mobile
					this.carList = res.data.carList
					this.recordRespVO = res.data.recordRespVO
          this.flowN = res.data.recordRespVO.flowN
					this.orderProcessRecord = res.data.orderProcessRecord
				})
			},
			//详情
			goDetail(id){
				uni.navigateTo({
					url:`/pages/category/productDetail?id=${id}`
				})
			},
			goNext(i){
				if(i==1){
					uni.navigateTo({
						url:`/pages/search/checkInformation?id=${this.orderId}&flowN=`+this.flowN
					})
				}
				if(i==2){
					uni.navigateTo({
						url:`/pages/search/reviewProgress?id=${this.orderId}`
					})
				}
        if(i==3){
          uni.navigateTo({
            url:`/pages/order/reject?id=${this.orderId}`
          })
        }
			},
			//修改驳回资料
			changeInform(){
				uni.navigateTo({
					url:`/pages/search/cantPassSelect?id=${this.orderId}`
				})
			},
      updateIdCards(){
        updateIdCard({orderId:this.id,idCard:this.user.identityCard}).then(res => {
            if (res.data){
              uni.$u.toast("身份证信息已更新！")
            }
        })
      },
      goUserZl(productTypeId){
        console.log(this.id)
        uni.navigateTo({
            url:`/pagesA/list/carInformation?id=`+productTypeId+"&ui="+this.id+"&listId="+this.tableId
        })
        // if (productTypeId==1 || productTypeId==7 || productTypeId==8 || productTypeId==9 || productTypeId==10 || productTypeId==14 || productTypeId==15 || productTypeId==16){
        //   uni.navigateTo({
        //     url:`/pages/setting/assetList?id=`+productTypeId+"&ui="+userId
        //   })
        // }else {
        //   uni.navigateTo({
        //     url:`/pagesA/list/carInformation?id=`+productTypeId+"&ui="+userId
        //   })
        // }
      },
			//时间戳转换
			getTime(time){
				let data= new Date(time);
				let year = data.getFullYear();
				let month = data.getMonth() + 1;
				let day = data.getDate();
				let h = data.getHours();
				let mm = data.getMinutes();
				let s = data.getSeconds();
				month = month >= 10 ? month : "0" + month;
				day = day >= 10 ? day : "0" + day;
				h = h >= 10 ? h : "0" + h;
				mm = mm >= 10 ? mm : "0" + mm;
				s = s >= 10 ? s : "0" + s;
				return `${year}-${month}-${day} ${h}:${mm}:${s}`;
			},
      callPhone() {
        wx.makePhoneCall({
          phoneNumber: this.mobile, // 需要用户手动点击拨号
        });
      },
      getWordings() {
        const maxAmount = uni.getStorageSync('max_amount')
        if (maxAmount) {
          this.maxAmountLabel = maxAmount
        }
        
        const annualInterest = uni.getStorageSync('annual_interest')
        if (annualInterest) {
          this.annualInterestLabel = annualInterest
        }
      }
		}
	}
</script>

<style lang="scss">
.content{
	padding: 25rpx
}
.title{
	padding: 20rpx;
}
.messageBar{
	padding: 20rpx;
	margin: 20rpx 0;
	border-radius: 10rpx;
	box-shadow: 0 0 20rpx #ccc;
	.top{
		padding: 20rpx 0;
		border-bottom: 1rpx dashed #dcdcdc;
		.left{
			.box{
				width: 6rpx;
				height: 13px;
				margin-right: 10rpx;
				background-color: #D34200;
			}
		}
	}
	.type{
    width: 180rpx;
    line-height: 60rpx;
		margin-top: 20rpx;
		border-radius: 40rpx;
		background-color: #A4ADB3;
	}
	.none{
		display: none;
	}
	.detail{
		min-height: 150rpx;
		padding-top: 20rpx;
		.bar{
			padding: 10rpx 0;
		}
		.pic{
			width: 45rpx;
			height: 45rpx;
			margin-right: 10rpx;
		}
		.right{
			width: 20rpx;
			height: 30rpx;
		}
		.reSet{
			width: 200rpx;
			margin-left: 20rpx;
			line-height: 60rpx;
			border-radius: 30rpx;
			background-color: rgb(211, 66, 0);
		}
	}
  .detail-card{
    min-height: 100rpx;
    padding-top: 20rpx;
  }
  .detail-user-zl{
    padding-top: 20rpx;
    .bar{
      padding: 10rpx 0;
    }
    .pic{
      width: 45rpx;
      height: 45rpx;
      margin-right: 10rpx;
    }
    .right{
      width: 20rpx;
      height: 30rpx;
    }
    .reSet{
      width: 200rpx;
      margin-left: 20rpx;
      line-height: 60rpx;
      border-radius: 30rpx;
      background-color: #4CAF50;
    }
  }
}

.reSets{
  width: 200rpx;
  margin-left: 70%;
  line-height: 60rpx;
  border-radius: 30rpx;
  background-color: #3F51B5;
}

.btn{
	line-height: 80rpx;
	margin: 20rpx 0;
	border-radius: 4rpx;
	//background-color: #D34200;

}

.btn-bg1{
  background-color: #607D8B;
}

.btn-bg2{
  background-color: #F44336;
}

.btn  image{
  width: 30rpx;
  height: 30rpx;
  margin-right: 10rpx;
}

.greenBtn{
	line-height: 80rpx;
	margin: 20rpx 0;
	border-radius: 40rpx;
	background-color: rgb(38, 150, 80);
  image{
    width: 30rpx;
    height: 30rpx;
    margin-right: 10rpx;
  }
}

.blueBtn{
  line-height: 80rpx;
  margin: 20rpx 0;
  border-radius: 40rpx;
  background-color: #3c57e9;
  image{
    width: 30rpx;
    height: 30rpx;
    margin-right: 10rpx;
  }
}

.contactBtn{
  width: 100%;
	line-height: 80rpx;
	margin: 20rpx 0;
	border-radius: 40rpx;
  background-color: #6922e7;
	image{
		width: 30rpx;
		height: 30rpx;
		margin-right: 10rpx;
	}
}
.customStyle{
  width: 60px;
}
.v-div{
  width: 100%;
}
.v-width{
  float: left;
  width: 48%;
  margin-left: 5px;
}
</style>
